<#import "macro.ftl" as m>
<@m.page_header title='反馈查询' />
<div id="page-content-wrapper">
	<form id="form" action="/feedbacks" method="GET" class="mrg20T">
		<input type="hidden" id="status" name="status" value="${status}">
        <div class="form-row">
            <div class="form-input col-md-6">
                <div class="row">
                    <div class="col-md-12">
                        <input placeholder="填写反馈内容查询" type="text" name="keyword" id="keyword" value="${keyword}">
                    </div>
                </div>
            </div>
            <div class="form-input col-md-2">
	        	<a href="javascript:;" class="btn large primary-bg radius-all-4" id="search" onclick="$('#form').trigger('submit');">
		            <span class="button-content">
		                查询
		            </span>
                </a>
	        </div>
        </div>
        <div class="form-row">
            <div class="form-input col-md-12">
                <#if status == "">
            		<#assign statusAll="bg-blue" />
            		<#assign statusNew="font-blue" />
            		<#assign statusProcessed="font-blue" />
            	<#elseif status == "New">
            		<#assign statusAll="font-blue" />
            		<#assign statusNew="bg-blue" />
            		<#assign statusProcessed="font-blue" />
            	<#elseif status == "Processed">
            		<#assign statusAll="font-blue" />
            		<#assign statusNew="font-blue" />
            		<#assign statusProcessed="bg-blue" />
            	</#if>
                <a href="javascript:;" class="btn medium ${statusAll}" onclick="submitByStatus('');" >
                	<span class="button-content">全部反馈</span>
                </a>
                <a href="javascript:;" class="btn medium ${statusNew}" onclick="submitByStatus('New');">
                	<span class="button-content">未处理</span>
                </a>
                <a href="javascript:;" class="btn medium ${statusProcessed}" onclick="submitByStatus('Processed');">
                	<span class="button-content">已处理</span>
                </a>
            </div>
        </div>
	</form>
	<table id="feedbacks" class="table">
        <thead>
            <tr>
            	<th>内容</th>
            	<th>反馈人</th>
            	<th>手机号</th>
            	<th>状态</th>
            	<th>反馈时间</th>
            	<th>平台</th>
            	<th>版本</th>
                <th>操作</th>
            </tr>
        </thead>
        <tbody>
        	<#list feedbacks.list as feedback>
				<tr id="${feedback.id}">
					<td>
						<#if feedback.content?length lt 10>
							${feedback.content}
						<#else>
							${feedback.content[0..9]}...
						</#if>
					</td>
					<td>${feedback.user.protectedRealName}</td>
					<td>${feedback.user.mobile}</td>
					<td id="statusName">${feedback.statusName}</td>
					<td>
						${(feedback.createDate?string('yyyy-MM-dd HH:mm:ss'))!''}
					</td>
					<td>${feedback.os}</td>
					<td>${feedback.version}</td>
	                <td>
	                    <a href="javascript:;" class="btn medium primary-bg" onclick="showReplyFeedback(${feedback.id});">
	                    	<span class="button-content">处理</span>
	                    </a>
	                </td>
	            </tr>
			</#list>
        </tbody>
     </table>
     <div class="button-group center-div">
    	${pagerHelper.content}
     </div>
</div>

<script>
// 通过订单状态提交
function submitByStatus(status){
	$('#status').val(status);
	$('#form').submit();
};

function showReplyFeedback( id ){
	$.get( "/feedbacks/" + id + "/reply", function( data ){
		var html = '<div id="dialog" class="hide" title="处理反馈"><div class="mrg10A">' + data + '</div></div>';
		$( html ).dialog({
	        resizable:!0,
	        minWidth:700,
	        minHeight:600,
	        modal:!0,
	        dialogClass:"modal-dialog",
	        closeOnEscape:!0,
	        close : function() {
				$( this ).dialog( "destroy" );
			},
	        buttons: {
	            反馈处理: function() {
	            	var valid = $('#dialog form').parsley( 'validate' );
	            	if(!valid){
	            		return;
	            	}
	            	
					$.ajax({
					    url: '/feedbacks/' + id + '/reply',
					    type: 'POST',
					    data: $('#dialog form').serialize()
					}).done(function(data) {
					    if (data["status"] == "success") {
					        $.jGrowl("回复反馈成功", {
					            sticky: !1,
					            position: "top-right",
					            theme: "bg-green"
					        });
							
							var row = $('#feedbacks tbody').find('tr[id=' + data.data.id + ']');
							row.find('#statusName').html(data.data.statusName);
							
					        $("#dialog").dialog("close");
					    } else {
					        $.jGrowl(data["message"], {
					            sticky: !1,
					            position: "top-right",
					            theme: "bg-red"
					        });
					    }
					}).fail(function() {
					    $.jGrowl("回复反馈失败", {
					        sticky: !1,
					        position: "top-right",
					        theme: "bg-red"
					    });
					});
	            }
			}
		});
	});
};
</script>